﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <script src="~/Script/Script.js"></script>
    <script src="~/Script/jquery-validate.js"></script>
    <script src="~/Script/messages.js"></script>
</head>
<body>
    <div>
        @using (Html.BeginForm())
        {
            <p>用户名：@Html.TextBox("UserName", "", new { @id = "UserName" })</p>
            <p>密码：@Html.Password("Password", "", new { @id = "Password" })</p>
            <p>确认密码：@Html.Password("Pwd", "", new { @id = "Pwd" })</p>
            <button type="submit">提交</button>
        }
    </div>
    <script>
        $(document).ready(function () {
            $("form").validate({
                rules: {
                    UserName: { required: true },
                    Password: { required: true },
                    Pwd: { required: true, equalTo: "#Password" },
                }, messages: {
                    UserName: { required: "请输入用户名" },
                    Password: { required: "请输入密码" },
                    Pwd: { required: "<span style='color:red'>请输入密码</span>", equalTo: "请确认密码输入是否相同" }
                }
            })
        }
        )
    </script>

</body>
</html>
